<template>
  <b-container>
    <b-row align-h="center" style="margin-top:10%">
      <b-form>
        <b-form-group label="用户名:" label-for="UserName">
          <b-form-input id="UserName" v-model="form.username" required placeholder="输入用户名"></b-form-input>
        </b-form-group>

        <b-form-group label="密码:" label-for="Password">
          <b-form-input
              type="password"
              id="Password"
              v-model="form.password"
              required
              placeholder="输入密码"
          ></b-form-input>
        </b-form-group>

        <b-form-group label="再次输入密码:" label-for="PasswordCopy">
          <b-form-input
              type="password"
              id="PasswordCopy"
              v-model="PasswordCopy"
              required
              placeholder="再次输入密码"
          ></b-form-input>
        </b-form-group>

        <b-button to="/" variant="info">返回</b-button>&nbsp;
        <b-button @click="Sign" variant="danger">注册</b-button>
      </b-form>
    </b-row>
  </b-container>
</template>

<script>
export default {
  data() {
    return {
      PasswordCopy: "",
      form: {
        username: "",
        password: "",

      }
    };
  },
  methods: {
    Sign() {
      if (this.form.username !== "" && this.form.password !== "") {
        if (this.form.password !== this.PasswordCopy) {
          alert("两次输入密码不一样!");
        } else {
          this.axios
              .post( "/dev_api/register", {
                username:this.form.username,
                password:this.form.password
              })
              .then(response => {
                console.log(response)
                if (response.data.code === 200) {
                  alert("注册成功！请进行登录");
                  this.$router.push("/login");
                } else {
                  alert(response.data.message);
                }
              });
        }
      }
    },
    created() {
      this.$parent.show_nav = false;
    }
    ,
    destroyed() {
      this.$parent.show_nav = true;
    }
  }
};
</script>

<style scoped>
</style>